/**
 * Created by liguangsong on 16/8/3.
 */
import React from 'react'
import getTeamColor from '../../assist/teamColor.js'

var SelectDateView = React.createClass({
    render() {
        var teamColor = getTeamColor(this.props.team);
        var rightBtnDisplay = 'block';
        if (this.props.index == 0) {
            rightBtnDisplay = 'none';
        }
        var leftBtnDisplay = 'block';
        if (this.props.index == this.props.length - 1) {
            leftBtnDisplay = 'none';
        }

        return (
            <div className="playerGameDate">
                <p className="playerGameDate">{this.props.date}</p>
                <img className="playerLeftDate" style={{display: leftBtnDisplay}} src='app/assist/edit_left.png' onClick={this.onLeftClick}/>
                <img className="playerLeftDate" style={{left: '750px', display: rightBtnDisplay}} src='app/assist/edit_right.png'
                    onClick={this.onRightClick} />
                <div className="dateLine" style={{background: teamColor}}/>
            </div>
        );
    },

    onRightClick(event) {
        var arrow = 'right';
        this.props.clickArrow(arrow);
    },

    onLeftClick(event) {
        var arrow = 'left';
        this.props.clickArrow(arrow);
    }
});

export default SelectDateView;